<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title></title>
		<!--<link href="css/bootstrap.min.css" rel="stylesheet" />-->
		<!--	<link href="css/bootstrap.min.css" rel="stylesheet" />
		<link href="plugin/bootstrap-select/css/bootstrap-select.min.css" rel="stylesheet" />-->

		<link href="css/style.css" rel="stylesheet" />
		<style>
			/*.container .left, .container .center>section, .container .right{
				display: none;
			}*/
		</style>
	</head>

	<body style="overflow-y: scroll;">
		<div class="content" id="main_container">
			<header></header>
			<div class="time">
				<p id="date" class="date"></p>
				<p id="day" class="day"></p>
			</div>
			<div class="container">
				<!--<div class="row">
					
				</div>-->
				<div class="left">
					<!--实时交易分析-->
					<section class="tradeinfo ssjyfx">
						<!--交易数据-->
						<div class="jysj">
							<h2>实时交易分析</h2>
							<div class="jye">
								<p class="jy-title">交易额</p>
								<p id="jye-detail" class="jy-detail">
								</p>
							</div>
							<div class="jys">
								<p class="jy-title">交易数</p>
								<p id="jys-detail" class="jy-detail">

								</p>
							</div>
						</div>
						<!--每笔收入列表-->
						<div class="mbsrlb">
							<!--<p>每笔收入列表</p>-->
							<section class="mbsrlb-list">
								<ul id="mbsrlb_list" class="bl">
									<!-- <li>住院收费处收入：
										<a class="money">899.85元</a>
										<a class="payway">现金</a>
										流水号：
										<a class="lsh">N1124100001201812031753001</a>
									</li> -->
								
								</ul>
							</section>
						</div>
					</section>

				</div>
				<div class="center">
					<!--实时交易量-->
					<section class="tradeinfo ssjyl">
						<h2>实时交易量</h2>
						<div id="ssjyl-content" class="ssjyl-content">

						</div>
					</section>
					<!--科室收入分析-->
					<section class="tradeinfo kssrfx">
						<h2>各科室收入分析</h2>
						<div class="kssrfx-content-wrap">
							<div>
								<section>
									<div id="kssrfx-d-content" class="kssrfx-content"></div>
									<p>当天</p>

								</section>
								<section>
									<div id="kssrfx-m-content" class="kssrfx-content"></div>
									<p>当月</p>
								</section>
								<section>
									<div id="kssrfx-y-content" class="kssrfx-content"></div>
									<p>当年</p>
								</section>
							</div>

						</div>

					</section>
					<!--金额占比-->
					<section class="tradeinfo fsjezb">
						<h2>支付金额占比</h2>
						<div class="fsjezb-content-wrap">
							<div>
								<section>
									<div id="fsjezb-d-content" class="fsjezb-content"></div>
									<p>当天</p>

								</section>
								<section>
									<div id="fsjezb-m-content" class="fsjezb-content">
									</div>
									<p>当月</p>
								</section>
								<section>
									<div id="fsjezb-y-content" class="fsjezb-content">
									</div>
									<p>当年</p>
								</section>
							</div>
						</div>

					</section>
				</div>
				<div class="right">
					<!--问题交易链路-->
					<section class="tradeinfo wtjyllfx">
						<h2>交易异常链路分析</h2>
						<p class="ycjy-detail">
							<span class="ycjy-title">交易流水号：</span>
							<span class="ycjy-info">N1124100001201812031753092</span>
						</p>
						<p class="ycjy-detail">
							<span class="ycjy-title">交易方式：</span>
							<span class="ycjy-info">扫码付</span>
						</p>
						<p class="ycjy-detail">
							<span class="ycjy-title">交易时间：</span>
							<span class="ycjy-info">2018-06-08 12:00:00</span>
						</p>
						<!--问题时间轴-->
						<div class="wwsjz">
							<div class="sjz-wrap">
								<div class="begin">开始</div>
								<div class="sjz-content">
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>发起交易</span></p>
									</section>
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>获取支付二维码</span></p>
									</section>
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>接收支付二维码</span></p>
									</section>
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>接收资金交易结果</span></p>
									</section>
									<section class="sjz-list error-list">
										<p>
											<a class="jt"></a><span>返回支付二维码</span></p>
									</section>
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>响应资金交易结果</span></p>
									</section>
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>接收HIS交易结果</span></p>
									</section>
									<section class="sjz-list">
										<p>
											<a class="jt"></a><span>响应HIS交易结果</span></p>
									</section>

								</div>
								<div class="end">结束</div>
							</div>
						</div>
					</section>
				</div>
				<div class="bottom" >
					<!--交易渠道交易趋势分析-->
					<section class="tradeinfo yyjyqs">
						<h2>医院交易趋势图</h2>
						<div id="yyjyqs-content" class="yyjyqs-content">

						</div>
					</section>
				</div>

			</div>

		</div>

		<script src="js/jquery.2.2.4.min.js"></script>
		<script src="js/vue.min.js"></script>
		<script src="js/highcharts.js"></script>
		<script src="js/highcharts-more.js"></script>
		<script src="js/exporting.js"></script>
		<script src="js/variable-pie.js"></script>
		<script src="js/index.js"></script>
		<script src="js/public.js"></script>
		<script src="js/biz.sshjy.js"></script>
		<script src="js/biz.ksshr.js"></script>
		<script src="js/biz.qdbj.js"></script>
		<script src="js/biz.yyjyqs.js"></script>
		<script src="js/websocket.js"></script>
		
		<script>
		  var inter1;
		  var inter2;
		  var inter3;
		  var inter4;
	
		function addTransOrders(sence,channel,orderNo,amount){
			
			var num=$("#mbsrlb_list>li").length;
			//if(inter4){clearInterval(inter4);}
			
			//inter4 = setInterval(function(){
				var num=$("#mbsrlb_list>li").length;
				if(num<6){
					$("#mbsrlb_list").append('<li>'+sence+'收入：<a class=\"money\">'+amount+'元</a><a class=\"payway\">'+channel+'</a>流水号：<a class=\"lsh\">'+orderNo+'</a></li>');
					return false;
				}
				
				$("#mbsrlb_list>li:eq(0)").animate({marginTop:"-50px"},1000,function(){
					$("#mbsrlb_list>li:eq(0)").remove();
				})
				
				$("#mbsrlb_list").append('<li>'+sence+'收入：<a class=\"money\">'+amount+'元</a><a class=\"payway\">'+channel+'</a>流水号：<a class=\"lsh\">'+orderNo+'</a></li>');
			//	},1000)
			
		}
		
		

		
		
			$(function() {
			
				//时间
				changeTime();

			//初始交易额，交易量
				initJYEJYS();
				
			//实时交易折线图
				loadsshjy();

				
				//科室收入占比
				loadkssr();
				
				//交易渠道
				loadqdbj();
				
				//医院交易趋势
				loadyyjyqs();
				
			


			})
		</script>
	</body>

</html>